<template>
	<view class="wrap">
		<Navbar></Navbar>
		<view class="">
			<Tabs :list="tabList" :currentTab="currentTab" @changeTab="changeTab"></Tabs>
		</view>
		<view class="home-list">
			<List :tab="tabList"  @changeTab="changeTab" :currentTab="currentTab"></List>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				currentTab:0,
				tabList:[
					{
						id:1,
						name:"全部"
					},
					{
						id:2,
						name:"前端"
					},
					{
						id:3,
						name:"后端"
					},
					{
						id:4,
						name:"代码人生"
					},
					{
						id:5,
						name:"职场人生"
					},
					{
						id:6,
						name:"人工智能"
					},
					{
						id:7,
						name:"音乐"
					},
					{
						id:8,
						name:"NBA"
					},
					{
						id:9,
						name:"本地新闻"
					},
					
				]
				
			}
		},
		onLoad() {
			console.log("dasdasd");
		},
		methods: {
			changeTab(e){
				// console.log(e);
				this.currentTab = e
			}
		}
	}
</script>

<style lang="scss">
	page {
			height: 100%;
			display: flex;
		}
	.wrap{
		display: flex;
		flex-direction: column;
		flex: 1;
		overflow: hidden;
		.home-list {
			flex:1;
			box-sizing: border-box;
			// border: 2px solid #4CD964;
		}
	}
</style>
